<template>
	<view>
		<search class="searchs"></search>
		<view class="main">
			<view class="navs navss bgw" style="">
				<view  @tap="tab(v.id)"  :class="{shopSort_nav_act:v.id == id }" v-for="(v,i) in navList" :key="i">
					<image :src="v.icon" mode=""></image>
					<p class="one">
						{{v.name}}
					</p>
				</view> 
			</view>
			<view class="shopList p30" style="padding-top: 20rpx;">
				<view @tap="go('../shopDetails/shopDetails?id='+v.id)" v-for="(v,i) in list" :key="i" class="shopDetail">
					<image class="shopLogo" :src="v.headImg" mode=""></image>
					<view class="shopText">
						<p class="one title">
							{{v.name}}
						</p>
						<p class="state">
							<view class="fraction">
								<image src="../../static/image/star.png" mode=""></image>
								5.0
							</view> 
							<view class="distance">
								{{v.distanceStr}}
							</view> 
						</p>
						<p class="label">
							<span>
								{{v.category.name}}
							</span>
						</p>
						<p v-if="v.validActivity !=null" class="bottom one">
							<span>活动</span>
							<view v-for="(j,k) in v.validActivity.activityItems" :key="k"> 
								满{{j.exceedPrice}}减{{j.deductionPrice}} 
							</view>  
						</p>
					</view> 
				</view> 
			</view> 
		</view>
		<view v-if="list == '' " class=" dataNone">
			<image src="../../static/image/noneShops.png" mode=""></image>
			<p> 暂无店铺 </p> 
		</view>
	</view>
</template>

<script>
	import search from '../../components/search/search.vue'
	import {storeList} from '@/api/api.js'
	export default {
		components:{
			search
		},
		data() {
			return {
				id:0,
				navList:[],
				list:[],
				act:0,
				pageable:{
					pageNumber:1,
					pageSize:10
				}
			};
		},
		onLoad(e) {
			this.id = e.id
			this.init()
			this.navList = uni.getStorageSync('IndexSort')
		},
		methods:{
			tab(id){
				this.id = id
				this.inits()
			},
			inits(){
				this.pageable.pageNumber = 1
				this.list = []
				this.init()
			},
			async init(){ 
				let data = await storeList({
					longitude:this.$store.state.longitude,
					latitude:this.$store.state.latitude,
					categoryId:this.id,
					pageable:this.pageable
				})
				this.pageable.pageNumber++
				this.list = [...this.list,...data.data]
				console.log(this.list);
			},
			go(url){
				console.log(url);
				this.$navigateTo(url)
			}
		}
	}
</script>

<style lang="less" scoped>
@import '../index/index.less';
</style>
